<template>
<div class="main_box" style="padding:10px">
  <div class="add_wrap">
    <div class="tit">
      <h2>基础信息</h2>
      <el-button type="success" plain size="small" icon="fa fa-mail-forward" @click="returnList">返回</el-button>
    </div>
    <el-form :model="editForm" ref="editForm" label-width="200px" :rules="roleRules">
      <el-row>
        <el-form-item label="菜单类别：" prop="menuCatetory">
          <span>{{editForm.menuCatetory == 1? "系统":"机构"}}</span>
        </el-form-item>
        <el-form-item label="菜单类型：" prop="menuType">
          <span v-if="editForm.menuType == 0">菜单分组</span>
          <span v-if="editForm.menuType == 1">功能菜单</span>
          <span v-if="editForm.menuType == 2">菜单按钮</span>
        </el-form-item>
        <el-form-item label="菜单名称：" prop="menuName">
          <el-input  v-model="editForm.menuName" :clearable="true"></el-input>
        </el-form-item>
        <el-form-item label="菜单编码：" prop="menuCode">
          <el-input  v-model="editForm.menuCode" :clearable="true"></el-input>
        </el-form-item>
        <el-form-item label="资源路径：" prop="menuUrl">
          <el-input  v-model="editForm.menuUrl" :clearable="true"></el-input>
        </el-form-item>
        <el-form-item label="排序(升序)：" prop="sortby">
          <el-input v-model="editForm.sortby" :clearable="true"></el-input>
        </el-form-item>
        <el-form-item label="描述" prop="descriptions">
          <el-input :clearable="true" type="textarea" v-model="editForm.descriptions"></el-input>
        </el-form-item>
      </el-row>
      <el-row>
        <el-form-item>
          <el-button plain type="primary" @click="sureClick">保 存</el-button>
          <el-button @click="returnList">取 消</el-button>
        </el-form-item>
      </el-row>
    </el-form>
  </div>
 </div>
</template>

<script>
import * as message from "@/constants/message"
import AuthApi from "@/api/system/auth";

export default{
  data(){
      return {
        editForm:{
          menuId: "",
          menuName: "",
          menuType: "0",
          menuCatetory: "1",
          menuCode: "SYSTEM_MANAGER_",
          menuUrl: "",
          sortby: "",
          descriptions: ""
        },
        menuTypes:[
          { label:"显示", value:1},
          { label:"不显示", value:0}
        ],
        roleRules: {
          menuName: [
            { required: true, message: "请输入菜单名", trigger: "blur" }
          ],
          menuCode: [
            { required: true, message: "请输入菜单编码", trigger: "blur" }
          ]/*,
          menuUrl:[
            { required: true, message: "请输入资源路径", trigger: "blur" }
          ]*/
        }
      }
  },
  components: {
  },
  mounted(){
    this.init();
  },
  methods: {
    init(){
      this.getData();
    },
    getData(){
      AuthApi.getMenuInfo({menuId:this.$route.query.id})
        .then(res => {
          this.$Utils.bindingBean(this.editForm, res.data);
      })
    },
    sureClick() {
      this.$refs.editForm.validate(valid => {
        if (valid) {
          this.$confirm(message.MSG_CONFIRM_SAVE_ALTER, message.TITLE_PROMPT, {})
            .then(() => {
                this.editMenu();
          });
        }
      })
    },
    editMenu() {
      let data = {
        menuName: this.editForm.menuName,
        menuCode: this.editForm.menuCode,
        descriptions: this.editForm.descriptions,
        menuUrl: this.editForm.menuUrl,
        sortby: this.editForm.sortby,
        menuId: this.editForm.menuId
      };
      AuthApi.editMenu(data)
        .then(res => {
          this.$Utils.notifySuccess()
          this.returnList()
      })
    },
    returnList(){
      this.$store.dispatch('delView', this.$route);
      this.$router.push({path: '/sys/menuManagement'});
    }
  }
}
</script>
<style lang="scss" src="@/assets/css/views/add.scss" scope>
</style>
